// // 创建元素
// let div = document.createElement("span") // 在内存中，还没有渲染
// // 添加内容
// div.innerText = "❤" // <div>我是创建的元素</div>
// let rand = (num) => {
//     return Math.floor(Math.random() * num)
// }
// div.style.color = "rgb(" + rand(255) + "," + rand(255) + "," + rand(255) +")" // rgb(0-255,0-255,0-255)
// div.style.fontSize = "20px" // <div style="color:red;font-size:20px;">我是创建的元素</div>
// let box = document.querySelector("#box")
// // 将创建的元素拼接到页面上的box元素中
// box.appendChild(div)

let on = () => {
    console.log("我被点击了");
}

// 获取button元素
let btn = document.querySelector("#btn")
btn.onclick = () => {
    console.log("神奇的按钮被点击了");
}

let input = document.querySelector("[name='username']")
let msg = document.querySelector("#msg")
// 当输入框获取焦点 改变背景颜色
let changeBack = () => {
    input.style.backgroundColor = "yellow"
}

let changeDefault = () => {
    input.style.backgroundColor = "white"
    console.log(input.value);
    let val = input.value
    // 校验数据是否合法
    if (!val) {
        msg.innerText = "输入数据不合法"
        msg.style.color = "red"
        return
    } else {
        if (val.length < 6 || val.length > 16) {
            msg.innerText = "输入长度不合法"
            msg.style.color = "red"
            return
        } else {
            msg.innerHTML = "√"
            msg.style.fontSize = "20px"
            msg.style.bold = "900"
            msg.style.color = "green"
        }
    }
    // 发送请求去后端查询用户名是否被注册
}

let image = document.querySelector(".sl")
image.onmouseover = () => {
    console.log("鼠标移入了");
    image.style.transform = "scale(2)" 
}

image.onmouseout = () => {
    console.log("鼠标移出了");
    image.style.transform = "scale(1)" 
}

